import { Checkbox } from "antd";
import PropTypes from "prop-types";
import React, { PureComponent } from "react";
import styles from "./index.less";

export default class FileItem extends PureComponent {

  render() {
    const {
      selected,
      selectMode = false,
      fileName,
      type = 'file',
      checked = false,
      onContextMenu = new Function(),
      onClick = new Function(),
    } = this.props;

    return (
      <div
        className={`${styles.fileItem} ${selected ? styles.selected : ''}`}
        onClick={onClick}
        onContextMenu={onContextMenu}
      >
        <Checkbox className={`${styles.checkbox} ${selectMode ? '' : styles.hidden}`} checked={checked} />
        <img src={require('../../assets/' + type + '.png')} alt="" />
        <div>
          {fileName}
        </div>
      </div>
    );
  }
}

FileItem.propTypes = {
  fileName: PropTypes.string.isRequired,
  selected: PropTypes.bool,
  checked: PropTypes.bool,
  selectMode: PropTypes.bool,
  onContextMenu: PropTypes.func,
  type: PropTypes.oneOf(['file', 'folder']),
  onClick: PropTypes.func,
};
